<template>
  <div class="app-container">
    <el-form :model="form" :rules="rules" :inline="true" label-width="100px">
      <el-row :gutter="40">
        <el-col :span="40">
          <el-form-item label="应用" prop="pkg">
            <el-select v-model="form.pkg" placeholder="应用" filterable clearable style="width: 100%">
              <el-option
                v-for="item in productList"
                :key="item.value"
                :label="item.name"
                :value="item.value" />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="40">
        <el-col :span="40">
          <el-form-item label="渠道" prop="channel">
            <el-select v-model="form.channel" placeholder="渠道" filterable clearable style="width: 100%">
              <el-option
              v-for="item in dict.type.sys_channel"
              :key="item.value"
              :label="item.label"
              :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="40" v-if="form.channel=='vivo'">
        <el-col :span="40">
          <el-form-item label="版本" prop="version">
            <el-select v-model="form.version" placeholder="版本" filterable clearable style="width: 100%">
              <el-option v-for="item in versionList" :key="item.value" :label="item.name" :value="item.value" />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <!-- <el-row :gutter="40" v-if="form.channel=='vivo'&&form.version == '2'">
        <el-col :span="40">
          <el-form-item label="投放类型" prop="launchType">
            <el-select v-model="form.launchType" placeholder="投放类型" filterable clearable style="width: 100%">
              <el-option v-for="item in launchTypeList" :key="item.value" :label="item.name" :value="item.value" />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row> -->
      <el-row :gutter="40">
        <el-col :span="40">
          <el-form-item>
            <el-button type="primary" @click="submitForm">生成监测链接</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div v-if="generatedLink" style="margin-top: 20px;">
      <el-input v-model="generatedLink" readonly style="width: 50%; height: 50%;" >
        <template #append>
          <el-button @click="copyLink">复制链接</el-button>
        </template>
      </el-input>
    </div>
  </div>
</template>

<script>
import copy from 'clipboard-copy'
import { getAllAppList,selectAppList } from '@/api/configs/appConfig';

export default {
  dicts: ['sys_channel'],
  data() {
    return {
      productList: [],
      versionList: [{"name":"V1","value":"1"},{"name":"V2","value":"2"}],
      launchTypeList: [{"name":"商店","value":"1"},{"name":"非商","value":"2"}],
      generatedLink: '',
      form: {
        pkg: '',
        channel: '',
      },
      rules: {
        pkg: [{ required: true, message: '应用不能为空', trigger: 'change' }],
        channel: [{ required: true, message: '渠道不能为空', trigger: 'change' }],
      },
    };
  },
  created() {
    this.init();
  },
  methods: {
    // 初始化
    init () {
      //查询应用列表
      getAllAppList().then(response => {
        this.productList = response.data.map(item => {
          return {
            id: item.id,
            appcode: item.appcode,
            name: item.appname,
            value: item.apppkg
          }
        })
      })
    },
    // 提交
    submitForm() {
      let vm = this;
      let url = 'https://tools.hnyynet.com.cn/tool-medium/monitor/'
      let app = vm.productList.find(item => item.value === vm.form.pkg);
      url += vm.form.channel + '/0/' + app.id + '/' + app.value + '/' + app.appcode
      if(vm.form.channel === 'oppo'){
        vm.generatedLink = url + '?adid=__ADID__&oaid=__OAID__&imei=__IMEI__&ts=__TS__&androidid=__ANDROIDID__&ip=__IP__&ua=$ua$&ownerid=$ownerid$&planid=$planid$&groupid=$groupid$&model=$m$&os_version=$ov$'
      }else if(vm.form.channel === 'vivo'){
        if(vm.form.version === '1'){
          vm.generatedLink = url + '?TS=__TS__&IMEI=__IMEI__&OAID=__OAID__&OAIDPLAIN=__OAIDPLAIN__&IP=__IP__&OS=__OS__&UA=__UA__&REQUESTID=__REQUESTID__&ADVERTISERID=__ADVERTISERID__&CREATIVEID=__CREATIVEID__&ADNAME=__ADNAME__&MODEL=__MODEL__&OV=__OV__&NT=__NT__&MAC=__MAC__&ANDROIDID=__ANDROIDID__&CAMPAIGNID=__CAMPAIGNID__&GROUPID=__GROUPID__&ADID=__ADID__&AV=__AV__'
        }else if(vm.form.version === '2'){
          // if(vm.form.launchType ==='1'){
          //   vm.generatedLink = url + '?TS=__TS__&IMEI=__IMEI__&OAID=__OAID__&OAIDPLAIN=__OAIDPLAIN__&IP=__IP__&OS=__OS__&UA=__UA__&REQUESTID=__REQUESTID__&ADVERTISERID=__ADVERTISERID__&clickid=__CLICKID__&ADNAME=__ADNAME__&MODEL=__MODEL__&OV=__OV__&NT=__NT__&MAC=__MAC__&ANDROIDID=__ANDROIDID__&CAMPAIGNID=__CAMPAIGNID__&GROUPID=__GROUPID__&ADID=__ADID__&AV=__AV__'
          // }else if(vm.form.launchType ==='2'){
            vm.generatedLink = url + '?TS=__TS__&IMEI=__IMEI__&OAID=__OAID__&OAIDPLAIN=__OAIDPLAIN__&IP=__IP__&UA=__UA__&REQUESTID=__REQUESTID__&ADVERTISERID=__ADVERTISERID__&clickid=__CLICKID__&ADNAME=__ADNAME__&MODEL=__MODEL__&OSVERSION=__OSVERSION__&ANDROIDID=__ANDROIDID__&CAMPAIGNID=__CAMPAIGNID__&GROUPID=__GROUPID__'
          // }
        }
      }else if(vm.form.channel === 'baidu'){
        vm.generatedLink = url + '?oaid={{OAID}}&oaid_md5={{OAID_MD5}}&imei_md5={{IMEI_MD5}}&android_id_md5={{ANDROID_ID_MD5}}&os={{OS}}&ip={{IP}}&ua={{UA}}&os_version={{OS_VERSION}}&ts={{TS}}&userid={{USER_ID}}&pid={{PLAN_ID}}&uid={{UNIT_ID}}&aid={{IDEA_ID}}&click_id={{CLICK_ID}}&callback_url={{CALLBACK_URL}}'
      }else if(vm.form.channel === 'yingyongbao'){
        vm.generatedLink = url + '?click_id=__CLICK_ID__&click_time=__CLICK_TIME__&adgroup_id=__ADGROUP_ID__&dynamic_creative_id=__DYNAMIC_CREATIVE_ID__&dynamic_creative_name=__DYNAMIC_CREATIVE_NAME__&creative_components_info=__CREATIVE_COMPONENTS_INFO__&marketing_target_id=__MARKETING_TARGET_ID__&account_id=__ACCOUNT_ID__&device_os_type=__DEVICE_OS_TYPE__&process_time=__PROCESS_TIME__&promoted_object_id=__PROMOTED_OBJECT_ID__&muid=__MUID__&hash_android_id=__HASH_ANDROID_ID__&ip=__IP__&user_agent=__USER_AGENT__&callback=__CALLBACK__&ipv6=__IPV6__&adgroup_name=__ADGROUP_NAME__&model=__MODEL__&keyword_id=__KEYWORD_ID__&keyword_text=__KEYWORD_TEXT__&hash_oaid=__HASH_OAID__'
      }else if(vm.form.channel === 'huawei'){
        vm.generatedLink = url
      }else if(vm.form.channel === 'xiaomi'){
        // vm.generatedLink = url + '?response_validate=false&imei=__IMEI__&oaid=__OAID__&click_time=__TS__&app_id=__APPID__&adid=__ADID__&campaign_id=__CAMPAIGNID__&customer_id=__CUSTOMERID__&callback=__CALLBACK__&sign=__SIGN__&ua=__UA__&ip=__IP__&androidId=__ANDROIDID__'
        vm.generatedLink = url + '?oaid=__OAID__&imei=__IMEI__&ip=__IP__&ua=__UA__&app_id=__APPID__&adreport_id=__ADREPORTID__&ad_name=__ADNAME__&campaign_id=__CAMPAIGNID__&customer_id=__CUSTOMERID__&ts=__TS__&callback=__CALLBACK__&sign=__SIGN__'
      }else{
        vm.generatedLink = ''
        vm.$modal.msgSuccess('该渠道暂未配置，请联系管理员');
      }
    },
   copyLink() {
      let vm = this;
      if (!vm.generatedLink) return
      copy(vm.generatedLink)
      this.$modal.msgSuccess('链接已复制到剪贴板');
    }
  }
}
</script>
